.tab{
  @include flex(flex, column);
  flex: 1;
  .tab-items{
    position: relative;
    z-index: 1;
    background-color: transparent;
    &:after{
      content: '';
      display: block;
      clear: both;
    }
    li{
      border-top: 3px solid transparent;
      border-top-left-radius: 5px;
      border-top-right-radius: 5px;
      float: left;
      &.active{
        border-top: 3px solid $blue-color;
        background-color: $white-color;
        @include box-shadow(0 5px 0 #fff);
        a{
          color: $blue-color;
        }
      }
      &:hover a{
        color: $blue-color;
      }
      &:focus{
        outline: none;
      }
      a{
        color: $light-font-color;
        background-color: transparent;
        padding: 10px 30px;
        display: block;
        cursor: pointer;
      }
    }
  }
  .tab-content{
    flex: 1;
    background-color: $white-color;
    padding: 20px;
    border-radius: 5px;
    &:after{
      content: '';
      clear: both;
      display: block;
    }
    >div{
      //@include animation(slideInBottom 0.6s ease-in-out);
    }
  }
}

// 二级tab
.tab-panels{
  .tab-head{
    @include box-shadow(inset 0 -1px $home-font-color-light);
    background-color: rgba(225, 233, 238, 0.35);
    &:after{
      content: '';
      display: block;
      clear: both;
    }
    li{
      float: left;
      a{
        display: block;
        padding: 10px 30px;
        color: $light-font-color;
        border-bottom: 2px solid transparent;
        cursor: pointer;
        &:focus{
          outline: none;
        }
      }
      &.active{
        border: 1px solid $home-font-color-light;
        border-bottom: none;
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
        background-color: #fff;
      }
      &:not(.active){
        a:hover{
          color: $blue-color;
        }
      }
    }
  }
  .toolbar{
    margin-top: 20px;
  }
  .tab-body{
    background-color: transparent;
    padding: 10px 0;
    .account-area{
      background-color: $bg-level-third;
      li a{
        color: #aaa;
      }
    }
  }
}

